import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:znmm/UI/A_Common/star_rating_bar.dart';
import 'package:znmm/UI/ProductPages/model/product_model.dart';
import 'package:znmm/config/app_extension.dart';
import '../../../config/app_style.dart';

class SearchListView extends StatelessWidget {
  final bool isHorizontal;
  final Function(ProductModel furniture)? onTap;
  final List<ProductModel> prodcList;

  const SearchListView({
    Key? key,
    this.isHorizontal = true, //水平
    this.onTap,
    required this.prodcList,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return isHorizontal == true
        ? SizedBox(
            //水平
            height: 240,
            child: ListView.separated(
              scrollDirection: Axis.horizontal,
              itemCount: prodcList.length,
              itemBuilder: (_, index) {
                ProductModel furniture = prodcList[index];
                return _listViewItem(furniture, index);
              },
              separatorBuilder: (BuildContext context, int index) {
                return const Padding(padding: EdgeInsets.only(left: 15));
              },
            ),
          )
        : MediaQuery.removePadding(
            removeTop: true,
            context: context,
            child: ListView.separated(
              shrinkWrap: true,
              //reverse: true,
              physics: const ClampingScrollPhysics(),
              itemCount: prodcList.length,
              separatorBuilder: (BuildContext context, int index) {
                return const Divider(
                  height: 0.2,
                  thickness: 0.2,
                  color: Colors.grey,
                );
              },
              itemBuilder: (_, index) {
                ProductModel furniture = prodcList[index];
                return Padding(
                  padding: const EdgeInsets.only(bottom: 15, top: 10),
                  child: _listViewItem(furniture, index),
                );
              },
            ));
  }

  Widget _productScore(ProductModel furniture) {
    return Row(
      children: [
        StarRatingBar(score: furniture.score),
        const SizedBox(width: 10),
        Text(furniture.score.toString(), style: h4Style),
      ],
    ).fadeAnimation(1.0);
  }

  Widget _productImage(String image) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(15.0),
      child: Image.asset(image, width: 150, height: 150),
    ).fadeAnimation(0.4);
  }

  Widget _listViewItem(ProductModel pducMol, int index) {
    Widget widget;
    widget = isHorizontal == true
        ? Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Expanded(
                  child: Hero(
                      tag: "list$index",
                      child: _productImage(pducMol.imagesList[0]))),
              const SizedBox(height: 10),
              SizedBox(
                //color: Colors.amber,
                width: 150,
                child: Text(
                  pducMol.title,
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ).fadeAnimation(0.8),
              ),

              //_productScore(pducMol),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text("\$${pducMol.price}",
                          textAlign: TextAlign.center,
                          style: TextStyle(fontSize: 16.sp, color: Colors.red))
                      .fadeAnimation(0.8),
                  SizedBox(
                    width: 10.sp,
                  ),
                  const Text(
                    r"$307.00",
                    style: TextStyle(decoration: TextDecoration.lineThrough),
                  ).fadeAnimation(0.8)
                ],
              )
            ],
          )
        : Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _productImage(pducMol.imagesList[0]),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.all(15),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(pducMol.title, style: h4Style).fadeAnimation(0.8),
                      const SizedBox(height: 5),
                      _productScore(pducMol),
                      const SizedBox(height: 5),
                      Text(
                        pducMol.description,
                        style: h5Style.copyWith(fontSize: 12),
                        maxLines: 2,
                        overflow: TextOverflow.ellipsis,
                      ).fadeAnimation(1.4)
                    ],
                  ),
                ),
              )
            ],
          );

    return GestureDetector(
      onTap: () => onTap?.call(pducMol),
      child: widget,
    );
  }
}
